//axios 的封装文件
/* 
1. 封装了baseUrl   api的根路径
2. 获取数据的过期时间
3. 封装了请求拦截和响应拦截
4. 请求数据，数据加载前的旋转小图标
5. 在请求拦截中 给后台传递了token
6. 在响应拦截里 输出报错信息\停止旋转小图标
*/
import { Message, Loading } from 'element-ui';
import store from '@/store';
import Vue from 'vue';
//引入 axios
import axios from 'axios';
//旋转小图标的变量
var loadObj = null;
const service = axios.create({
    baseURL: "http://localhost:3007",//baseURL   URL都要大写 根路径才会起作用
    timeout: 10000
})

// 添加请求拦截器
service.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    //token  config.headers.Authorization = token  的值
    config.headers['user-token'] = store.getters.token;
    // 显示旋转小图标
    if (!loadObj) {
        loadObj = Loading.service({
            text: '加载中...',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)',
            lock: true
        })
    }

    return config;
}, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
});

// 添加响应拦截器
service.interceptors.response.use(function (response) {
    //清除小图标，  nextTick 将某些操作推后到 页面内容都加载完成后再执行
    Vue.nextTick(() => {
        loadObj.close();
    })
    // 对响应数据做点什么
    console.log(response);
    // 没有报错直接返回，如果有保错,显示报错信息
    if (response.data.code === 666) {
        return response;
    } else {
        Message({ message: response.data.msg, type: "error" });
        return Promise.reject(response.data.msg);
    }
}, function (error) {
    Vue.nextTick(() => {
        loadObj.close();
    })
    // 对响应错误做点什么
    Message({ message: error, type: "error" });
    return Promise.reject(error);
});

//输出
export default service;